import { PROJECT_URL } from "../../constants/config";

export const frontend = [
  {
    name: "HTML5",
    path: `${PROJECT_URL}/icons/skills/html5-colored.svg`,
    iTag: "html5",
    link: "https://developer.mozilla.org/en-US/docs/Glossary/HTML5",
  },
  {
    name: "React",
    path: `${PROJECT_URL}/icons/skills/react-colored.svg`,
    iTag: "react",
    link: "https://reactjs.org/",
  },
  {
    name: "NextJs",
    path: `${PROJECT_URL}/icons/skills/nextjs-colored.svg`,
    darkPath: `${PROJECT_URL}/icons/skills/nextjs-colored-dark.svg`,
    iTag: "nextjs",
    link: "https://nextjs.org/docs",
  },
  {
    name: "Vue",
    path: `${PROJECT_URL}/icons/skills/vuejs-colored.svg`,
    iTag: "vuejs",
    link: "https://vuejs.org/",
  },
  {
    name: "Nuxtjs",
    path: `${PROJECT_URL}/icons/skills/nuxtjs-colored.svg`,
    iTag: "nuxtjs",
    link: "https://nuxtjs.org/",
  },
  {
    name: "Gatsby",
    path: `${PROJECT_URL}/icons/skills/gatsby-colored.svg`,
    iTag: "gatsby",
    link: "https://www.gatsbyjs.com/",
  },
  {
    name: "Angular",
    path: `${PROJECT_URL}/icons/skills/angularjs-colored.svg`,
    iTag: "angularjs",
    link: "https://angular.io/",
  },
  {
    name: "JQuery",
    path: `${PROJECT_URL}/icons/skills/jquery-colored.svg`,
    iTag: "jquery",
    link: "https://jquery.com/",
  },
  {
    name: "CSS3",
    path: `${PROJECT_URL}/icons/skills/css3-colored.svg`,
    iTag: "css3",
    link: "https://www.w3.org/TR/CSS/#css",
  },
  {
    name: "Sass",
    path: `${PROJECT_URL}/icons/skills/sass-colored.svg`,
    iTag: "sass",
    link: "https://sass-lang.com/",
  },
  {
    name: "TailwindCSS",
    path: `${PROJECT_URL}/icons/skills/tailwindcss-colored.svg`,
    iTag: "tailwindcss",
    link: "https://tailwindcss.com/",
  },
  {
    name: "Chakra UI",
    path: `${PROJECT_URL}/icons/skills/chakra-colored.svg`,
    iTag: "chakra",
    link: "https://chakra-ui.com/",
  },
  {
    name: "Bootstrap",
    path: `${PROJECT_URL}/icons/skills/bootstrap-colored.svg`,
    iTag: "bootstrap",
    link: "https://getbootstrap.com/",
  },
  {
    name: "Material UI",
    path: `${PROJECT_URL}/icons/skills/materialui-colored.svg`,
    iTag: "materialui",
    link: "https://mui.com/",
  },
  {
    name: "Redux",
    path: `${PROJECT_URL}/icons/skills/redux-colored.svg`,
    iTag: "redux",
    link: "https://redux.js.org/",
  },
  {
    name: "Webpack",
    path: `${PROJECT_URL}/icons/skills/webpack-colored.svg`,
    iTag: "webpack",
    link: "https://webpack.js.org/",
  },
  {
    name: "Babel",
    path: `${PROJECT_URL}/icons/skills/babel-colored.svg`,
    darkPath: `${PROJECT_URL}/icons/skills/babel-colored-dark.svg`,
    iTag: "babel",
    link: "https://babeljs.io/",
  },
  {
    name: "Svelte",
    path: `${PROJECT_URL}/icons/skills/svelte-colored.svg`,
    iTag: "svelte",
    link: "https://svelte.dev/",
  },
  {
    name: "Servomon",
    path: `${PROJECT_URL}/icons/skills/servomon-colored.svg`,
    iTag: "servomon",
    link: "https://servemon.netlify.app/",
  },
  {
    name: "Vite",
    path: `${PROJECT_URL}/icons/skills/vite-colored.svg`,
    iTag: "vite",
    link: "https://vitejs.dev/",
  },
  {
    name: "Remix",
    path: `${PROJECT_URL}/icons/skills/remix-colored.svg`,
    darkPath: `${PROJECT_URL}/icons/skills/remix-colored-dark.svg`,
    iTag: "remix",
    link: "https://remix.run/",
  },
  {
    name: "Ember.js",
    path: `${PROJECT_URL}/icons/skills/emberjs-colored.svg`,
    iTag: "emberjs",
    link: "https://emberjs.com/",
  },
  {
    name: "Astro",
    path: `${PROJECT_URL}/icons/skills/astro-colored.svg`,
    darkPath: `${PROJECT_URL}/icons/skills/astro-colored-dark.svg`,
    iTag: "astro",
    link: "https://astro.build/",
  },
  {
    name: "Qwik",
    path: `${PROJECT_URL}/icons/skills/quik-colored.svg`,
    darkPath: `${PROJECT_URL}/icons/skills/quik-dark.svg`,
    iTag: "quik",
    link: "https://qwik.builder.io/",
  },
  {
    name: "SolidJS",
    path: `${PROJECT_URL}/icons/skills/solidjs-colored.svg`,
    darkPath: `${PROJECT_URL}/icons/skills/solidjs-dark.svg`,
    iTag: "solidjs",
    link: "https://www.solidjs.com/",
  },
  {
    name: "Shadcn/ui",
    path: `${PROJECT_URL}/icons/skills/shadcnui-colored.svg`,
    darkPath: `${PROJECT_URL}/icons/skills/shadcn-dark.svg`,
    iTag: "shadcnui",
    link: "https://ui.shadcn.com/",
  },
];
